<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>加油优惠价格计算</title>
    <script>
        function calculatePrice() {
            var gasolineType = document.getElementById("gasolineType").value;
            var fuelAmount = parseFloat(document.getElementById("fuelAmount").value);
        
            var unitPrice;
            if (gasolineType === "92") {
                unitPrice = fuelAmount > 20 ? 5.9 : 6.0;
            } else if (gasolineType === "97") {
                unitPrice = fuelAmount > 40 ? 6.5 : 7.0;
            } else if (gasolineType === "98") {
                unitPrice = fuelAmount > 20 ? 7.2 : 7.5;
            } else {
                alert("请输入有效的汽油编号：92, 97, 98");
                return;
            }
        
            var totalPrice = unitPrice * fuelAmount;
        
            document.getElementById("unitPrice").innerText = "单价：" + unitPrice.toFixed(2) + " 元/升";
            document.getElementById("totalPrice").innerText = "总价：" + totalPrice.toFixed(2) + " 元";
        }
        </script>
        </head>
        <body>
        <label for="gasolineType">请输入汽油编号(92, 97, 98):</label>
        <input type="text" id="gasolineType">
        <br>
        <label for="fuelAmount">请输入加油量(升):</label>
        <input type="text" id="fuelAmount">
        <br>
        <button onclick="calculatePrice()">计算总价格</button>
        <p id="unitPrice"></p>
        <p id="totalPrice"></p>
        </body>
        </html>